@vm-bg-color: white;        //
@vmb-bg-color: #ECE9E9;     //
@vmbl-bg-color: #374047;    //
@vmbl-font-color: #FFFFFF;    //
@vmbc-bg-color: #FCFCFC;    //
@vmbr-bg-color: #FFFFFF;    //
@vmh-h: 50px;               //v-main-head height, default value 80px
@vmbl-w: 268px;              //v-main-body-left width, default value 92px
@vmbr-w: 0px;             //v-main-body-right width, default value 158px
@vmbc-margin: 8px;          //v-main-body-center margin, default value 8px


/*
background-color: #374047;
font-size: 1.2rem;
color: #FFFFFF;
*/

.v-main{
    position: fixed;
    width:100%;
    height:100%;
    overflow: hidden;
    top:0px;
    left:0px;
    background-color: @vm-bg-color;
    &>.v-main-head{
        position: absolute;
        line-height: @vmh-h;
        font-size: 1.4rem;
        height: @vmh-h;
        width: 100%;
        top: 0px;
        left: 0px;
        overflow: hidden;
        border-bottom: 1px solid #d9d9d9;
        border-color: #e5e5e5;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-focus: ignore;
        -moz-user-select: none;
        -moz-user-input: disabled;
    }
    &>.v-main-body{
        position:absolute;
        width:100%;
        top:@vmh-h;
        bottom:0px;
        left:0px;
        right:0px;
        overflow:auto;
        /*border-top:1px solid #E4E2E2;*/
        background-color: @vmb-bg-color;
        &>.v-main-body-left{
            position: absolute;
            height: 100%;
            top: 0px;
            left: 0px;
            width: @vmbl-w;
            overflow-x: hidden;
            background-color: @vmbl-bg-color;
            font-size: 1.2rem;
            color: @vmbl-font-color;
            opacity: .95;
            -webkit-transition: .3s ease-out;
            -moz-transition: .3s ease-out;
            -o-transition: .3s ease-out;
            transition: .3s ease-out;
            /*-webkit-box-shadow: -3px 2px 6px -2px #c7c7c7 inset, -1px 0 0 0 #c7c7c7 inset;
            box-shadow: -3px 2px 6px -2px #c7c7c7 inset, -1px 0 0 0 #c7c7c7 inset;*/
            &::-webkit-scrollbar {
                background: transparent;
                width: 5px;
            }
            &:hover::-webkit-scrollbar {
                background: #FFF;
            }
            &:hover::-webkit-scrollbar-thumb {
                border-radius: 5px;
                background: #ccc;
            }
        }
        &>.v-main-body-center{
            position: absolute;
            overflow: hidden;
            top: @vmbc-margin;
            bottom: @vmbc-margin;
            right: @vmbr-w + @vmbc-margin;
            left: @vmbl-w + @vmbc-margin;
            /*border: 1px solid #D8D8D8;
            background-color: @vmbc-bg-color;*/
            -webkit-transition: .3s ease-out;
            -moz-transition: .3s ease-out;
            -o-transition: .3s ease-out;
            transition: .3s ease-out;
        }
        &>.v-main-body-right{
            position:absolute;
            height:100%;
            top:0px;
            right:0px;
            width:@vmbr-w;
            background-color:@vmbr-bg-color;
            border-left:1px solid #EAE7E7;
            overflow:auto;
        }
    }
    &>.v-main-foot{
        position:absolute;
        width:100%;
        height:0px;
        overflow:hidden;
        bottom:0px;
        left:0px;
    }
}
